Back to Contents

Maintaining the site

Web publishing with Freeway

This chapter is designed to give you a quick overview of how to use Freeway to produce a Web site. It's important to understand how the process works before you start a site in Freeway, especially if you have tried other Web publishing software before. Freeway works differently from most other Web publishing tools you may have tried, so make sure you're happy with this overview before embarking on a project.

Unlike most Web publishing tools, Freeway does not edit HTML documents directly. Instead, it creates a document which contains the pages you wish to publish on the Web, and then exports the document as HTML into a destination folder.

This method of working removes the restrictions that working in HTML places on design freedom, because while you work within Freeway there are few limitations on what you can do as you assemble the elements for your pages. Freeway then uses powerful techniques to reproduce your page elements in a form useable on the Web, and if you try to do something which can't be reproduced exactly using HTML, Freeway will show you onscreen the compromises that have to be made.

There are several steps to designing a Web site using Freeway:

1. Planning the site
2. Designing the layout
3. Creating and assembling content
4. Creating a new Freeway document
5. Defining grids, master pages and navigation
6. Adding and laying out pages
7. Previewing the site and making corrections
8. Publishing and uploading the site to your Web space
9. Maintaining the site

Planning a site

It's usually beneficial to spend some time planning the site before you start, even if it's just a few minutes to gather your thoughts - this will help to avoid false starts and the inevitable reworking that results from poor planning.

If you are designing for clients, then it's essential that you understand their requirements and expectations up front and then plan how to fulfil these - for example, you may find that they want to have advanced features such as multimedia, animation, database integration or electronic commerce, which you may not have experience in creating yourself. Obviously, it's best to find this out at an early stage, so you can locate any external resources or contractors to assist you.

You may also want to clarify up-front with the client how far your responsibility extends - are you just going to hand off a disk containing the HTML and graphics which make up the site, or are you expected to upload it to their Web space? Do they expect you to provide Web space for them? What about revisions and routine maintenance?

Designing the layout

Just as with designing for print, you'll probably want to take a few moments to rough out some ideas on paper before you sit down at the machine. Even experienced designers usually find that sitting at a computer staring at a blank page is the last place to find inspiration!

If you're producing work for clients, you may be working closely with them on the design brief - perhaps the site needs to fit in with an existing identity, so that typefaces, colors and even design elements may be prescribed for you - or you may be expected to come up with an identity yourself.

Either way, you'll want to get client approval for the design before you go too far down the road of creating the site. Freeway is great for pulling a few ideas together quickly, and producing two or three mock sites for clients to look at, in a very short space of time.

Don't worry too much if the client wants some small last minute changes, though - as long as changes only affect elements created within Freeway, you'll be able to take them in your stride at any stage. It's mainly design elements that need to be painstakingly created in other packages which cause trouble if the client wants to change them - be especially sure to clear typeface and color choices with the client if you're going to be doing any animation, 3D work, or image manipulation to form part of the site content. If possible, make sure the client understands that last minute changes here are going to cost them dearly.

The end product of the design stage should be confirmation of the basic layout that's going to be used, as well as an understanding between you and the client over typeface, color, and how much (and what) technology is going to be used. If they want frames or Javascript in the finished product, this is going to take you longer and cost them more.

Creating and assembling content

With the design stage complete, you're ready to begin creating and assembling the content for the site. This includes the basic textual copy for the pages, and any graphic or multimedia elements that can't be easily created within Freeway, for example animated GIFs, bitmap graphics that use special effects like transparency or feathered drop shadows, images and so on.

It's often a good idea to assemble all the resources in one place before you import them into Freeway, purely for administrative reasons. When the project's complete, archive the resources along with the Freeway document and the finished HTML site folder.

Your site will probably need to be amended, and there's often no telling when you're going to need to get hold of the original materials in a hurry. Keeping all the resources together may mean wasting a little disk space by keeping duplicate files, but can save frantic searching through your network volumes or archive media for that scan that needs to be retouched a month down the line.

When you're creating art for the Web, it's perfectly adequate to work at 72dpi for bitmap images - you'll find you're spending less time watching the clock in Photoshop and more time creating as a result. The only drawback is if you subesquently want to use a piece of art you created for online use larger than originally planned, or in a printed piece - you can't resize bitmap art larger without ruining it. If there's a likelihood that you could find yourself in this position, create your art at print resolution (c. 300dpi for halftone work), and then either let Freeway resample it down to Web resolution when you use it, or create your own version resampled down to 72 dpi.

If you're creating art in a vector illustration program such as Illustrator or Freehand, the best route is to save that as EPS, and then use Photoshop to rasterize it for you. Save the finished raster version as TIFF for import into Freeway. Don't import EPS into Freeway for output on the Web in anything other than an emergency - the output quality won't be up to much, as Freeway can't rasterize the PostScript - all it can do is use the PICT screen preview.

Alternatively, the most up-to-date versions of these professional drawing tools will often allow you to save a version as a bitmap format - again, TIFF is the preferred option here, and be sure not to overwrite the original vector version.

You don't need to save your artwork as GIF or JPEG before you use it in Freeway - in fact, you often have more control and get better results if you don't. Repeated JPEG compression of an image will introduce cumulative artefacts which damage the image more each time. Try to avoid PICTs if possible, especially for large bitmap images.

If you're creating content like animation or animated GIF, be sure to allow extra time for this, unless you're well used to this sort of work and are confident about how long you'll need.

Don't create bitmap graphics of text or simple shapes in an image editing program - Freeway allows you to create these with much more control and greater flexibility. As you're planning the actual content, try to look for things that can be created in Freeway itself, and do so - when last minute changes are called for, you'll be glad you did!

When you finally import the finished content into Freeway, the originals are left untouched, and Freeway stores a version internally. The original is used when the site is published, but in emergency Freeway often has enough information stored to get good enough results even if the original is missing.

Creating a new Freeway document

Once you've come up with a basic layout, the essential design decisions have been made, and you have assembled at least some of the content, you can then go ahead and create a new Freeway document. At this stage you need to decide on the screen size you want to design for, and use these settings in the document setup dialog.

If you want to create pages that don't scroll, a size of about 530 pixels wide by 350 high should get you through - this should be small enough to fit into a browser window on a 640 by 480 monitor or display on a WebTV unit without scrolling.

If you're planning on making pages that hold more content than is visible at one time, make sure people only have to scroll vertically, not horizontally, at your chosen target screen resolution.

Your Freeway document is essentially a self-contained unit (fonts and external resources aside). It can contain as many pages as you need, and even allow you to define a hierarchical folder structure for your site, and the whole thing is saved as one file. This document file is not uploaded to the Web, but stays put on your system. Only Freeway can open the document.

To view the site in a Web browser, you need to export it as HTML into a destination folder. This folder is known as the site folder, and it is the contents of this folder that need to be uploaded to your Web space when you publish your site on the Web.

You can either create a new folder and set it as the destination folder for the document as you create it, or wait until you preview the site for the first time, in which case you will be prompted to select or create a folder.

When you want to make changes to your site, you open this document up in Freeway, edit it, and then publish it into the destination folder again.

Defining grids, master pages and navigation

Once you have created your new document, the first job is generally to set up a consistent layout grid using one or more master pages. These master pages form a basis for the real pages you create in your document - the guides and grid you define are repeated on every page that uses the master page, and any page elements also appear on all the instance pages.

Master pages can be used to ensure consistent design, branding and navigation through your site. Navigation elements which are graphic in nature should be repeated as links on HTML text elsewhere on the page, so that visitors browsing with their images off or using older browsers can still navigate your site.

You should also be scrupulous about defining Alt Text for graphic elements which are either used for navigation or are informational as opposed to decorative.

Remember that the visitor is only going to see one page at a time, and is going to have to reach every page in your site by navigating from a starting point - you need to keep asking yourself, does this make sense? Is it easy to tell which section I'm in or which page I'm on? Is it obvious where to go now? Is it easy to get back to the home page?

Adding and laying out pages

Apart from the familiar tasks of drawing boxes, adding text, graphics and other content, positioning, resizing, formatting and so on, there are other considerations to bear in mind at this stage.

You can use the window title in the browser to help customers keep track of where they are - use the Title field in the Inspector palette to set these, and make them helpful and informative. You can also add explanatory text to hyperlinks which will appear in the status bar at the bottom of the window in most modern browsers - see the chapter on customizing Freeway's output to see how to do this.

Remember to give the home page in the site a sensible title, such as "SoftPress Systems Home Page" so that when someone bookmarks it, it is easy to find again in the menu.

Also, remember to set the file name for the home page to something like index.html or default.html (whichever is supported by the Web server software you're going to be using). This is so that someone coming to your Web site without specifying a particular page name will be given the home page automatically. Do this using the Page panel in the Inspector palette in Freeway.

IMPORTANT - Never, never rename the files which Freeway has created, as this will break the links between pages in your site or mean that images won't load when the page is viewed.

Previewing the site and making corrections

You'll find it helpful to preview the page you're working on in the Web browser of your choice from time to time as you're working. Although Freeway's screen feedback is excellent, it will still be subtly different from the result in the browser, and by checking in the browser periodically you can alert yourself to any problems that emerge.

You must also take care to preview the site using a variety of different browser versions, and using both Netscape Navigator and Microsoft Internet Explorer. Unfortunately, just because a page looks fine in one does not mean it will automatically look good in the other.

You should also try viewing the pages you create with the browser font sizes set to larger than the default. This is essential because there are circumstances where page elements may break or move apart if the font size is larger than you assumed.

Also, be aware that font sizes on the PC are approximately one third larger than they are on the Mac, and problems can appear when pages that look fine on the Mac are viewed using Windows browsers.

If you don't have a PC available to check the pages yourself, ask a friend or colleague with a PC to check the site for you, or join a Web design mailing list on the Internet and ask for a site review. You may be surprised how helpful people are on such lists, but you do need to have the pages available on the Web for other people to view at their convenience.

Publishing and Uploading the site to your Web space

As described above, to view your pages in a Web browser, the document needs to be exported as HTML. When you use the Preview command in Freeway to view your page in the browser, the entire site is automatically published into the destination folder.

Publishing your site is therefore simply a matter of ensuring that the destination folder is up to date with any last minute changes you may have made since the last time you previewed the site. Using either the Preview command or the Publish command will cause the destination folder to be brought up-to-date - the only difference between the Publish command and the Preview command is that the Preview command builds the site then launches a browser and opens the HTML version of the current page in the document.

Your site is now contained in the destination folder, and the next stage is to upload the files to your Web space. Unless you have a Web server on your internal network, you are going to need to use a File Transfer Protocol (FTP) client to make a connection to your Web space and transfer the files from your local hard disk.

The two FTP clients in common use are Fetch and Anarchie - these are both shareware utilities and are easily located on the Internet or on magazine cover CDs. If you rent an Internet connection from an Internet Service Provider (ISP), they may also have supplied an FTP client with the original software bundle they gave you.

In order to make the connection to your Web space, you need to know a URL, a username and password. If in doubt about what these should be, you need to speak to either your Web server system administrator or the support helpline of your ISP, who will be able to give you this information.

Once the connection is open, you can simply open the destination folder, select the entire contents and drag them into the window of your FTP client - alternatively, you can use a command in the FTP client to upload the entire contents of the destination folder.

When using either utility, you must be careful not to alter the filenames or relative locations of any of the content of the destination folder, otherwise links between pages or to objects in your site will be broken. You need to ensure that the FTP client is set to transfer your files as "Raw Data" or the equivalent. Often, you'll find the default is set to MacBinary, which is a compressed format and will cause problems with the files, and/or the filenames.

NOTE 1 - See the support area of the SoftPress Web site for detailed intructions on using Fetch and Anarchie.

NOTE 2 - There is a single exception to the rule that you must upload the entire contents of Freeway's destination folder - the file _siteinfo is not required, and can be omitted if so desired without adverse consequence.

Maintaining the site

When the time comes to make changes to your site, the easiest way of doing this is to open the original Freeway document, make the changes you need, and publish the site again into your destination folder.

To help you to identify which files have been changed, before publishing the site it's a good idea to use the Label command in the Finder to apply a label to the files in the folder before you publish the site again. This means that any new or altered files which are (re)created by Freeway will not have the label, and can easily be identified by using the View - By label command in the Finder.

These files are the ones you need to upload to the Web space as before. Another way of easily identifying the files which have changed is to view By Date. If you remove pages or other site elements from the Freeway document, the destination folder is automatically updated to reflect this, and any redundant files created by Freeway are deleted. This means that your destination folder is always completely up-to-date and does not contain any redundant files.

Back to the top
Introduction | Getting Started | User Guide | Contacting SoftPress